<template>
  <section>
    <!--工具条-->
    <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
      <el-form :inline="true">
        <el-form-item>
          <el-button type="success" icon="plus" style="width: 120px"  @click="addTicket">添加门票</el-button>
        </el-form-item>
      </el-form>
    </el-col>

    <!--门票列表-->
    <el-table :data="ticketData" style="width: 100%">
      <el-table-column prop="id" label="ID" width="60">
      </el-table-column>
      <el-table-column prop="farm_id" label="农场" width="120">
      </el-table-column>
      <el-table-column prop="name" label="票名" width="120">
      </el-table-column>
      <el-table-column prop="title" label="标题" min-width="180">
      </el-table-column>
      <el-table-column prop="price" label="单价（元）" width="140" :formatter="changePrice">
      </el-table-column>
      <el-table-column prop="type" label="类型" width="100" :formatter="changeType">
      </el-table-column>
      <el-table-column prop="max_people" label="同行人数" width="120">
      </el-table-column>
      <el-table-column prop="max_people" label="同行人数" width="120">
      </el-table-column>
      <el-table-column prop="is_sale" label="销售" width="100" :formatter="isSale">
      </el-table-column>
      <el-table-column prop="create_time" label="创建时间" width="180">
      </el-table-column>
      <el-table-column label="操作" min-width="100">
        <template slot-scope="scope">
          <el-button type="warning" size="small" @click="editTicket(scope.row.id)">编辑</el-button>
          <el-button type="danger" size="small" @click="deleteTicket(scope.row.id)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </section>
</template>
<script type="text/ecmascript-6">
  import { apiTree } from '../../apiTree'
  export default {
    name: 'ticket',
    data() {
      return {
        ticketData: [], // 门票列表
        total: 0
      }
    },
    methods: {
      // 改变类型
      changeType(row) {
        return row.type === '1' ? '门票' : (row.type === '2' ? '套餐票' : '未知')
      },
      // 改变单价单位
      changePrice(row) {
        return parseInt(row.price) / 100
      },
      // 是否上架
      isSale(row) {
        return row.is_sale === '1' ? '上架' : '下架'
      },
      // 添加门票
      addTicket() {
        this.$router.push('/ticket/add');
      },
      // 编辑门票
      editTicket(_id) {
        this.$router.push('/ticket/edit/id/' + _id);
      },
      // 删除门票
      deleteTicket(_id) {
        let param = {'id': _id};
        apiTree('ticket/ticket', 'ticket/delete', param).then((res) => {
          if (res.s === 1) {
            this.$message({
              message: '删除成功',
              type: 'success'
            });
          }
          this.ticketList();
        });
      },
      // 获得门票列表
      ticketList() {
        let param = {};
        apiTree('ticket/ticket', 'ticket/list', param).then((res) => {
          this.ticketData = res.d.data;
          this.total = res.d.total_num;
        });
      }
    },
    created() {
      this.ticketList();
    },
    watch: {
      $route: '123'
    }
  }

</script>

<style type="text/css" media="screen">
  .top-title {
    display: block;
    width: 100%;
    height: 40px;
    text-indent: 10px;
    line-height: 40px;
    font-size: 20px;
    color: #F78A73;
  }
</style>
